<template>
      <div class="header">
        <div class="article-title">
            <h1 style="margin: 0px 0px;border-bottom: none;margin-left: 10px;">{{$store.state.article.title}}</h1>
        </div>   
      <div class="article-bar-top">
         <div class="publishtpye">
            <p style="color: black;" v-show="$store.state.article.isrelease===1">草稿</p>
            <p style="color: coral;" v-show="$store.state.article.isrelease===0">原创</p>
         </div>
         <div class="nickname">
            <a href="">{{$store.state.user.account}}</a>
         </div>
         <div class="ReleaseTime">
            <img src="@/assets/icon/clock-fill.svg">
            于 {{$store.state.article.createTime}} 发布
         </div>
         <div class="Expose">
            <img src="@/assets/icon/eye-fill.svg">
            2982
         </div>

         <div class="save">
            <img src="@/assets/icon/star-fill.svg">
            收藏 5 
         </div>


      </div>
       <div class="tags" style="margin-left: 66px;opacity: 0.7;">
<!--         <span v-if="this.$store.state.article.tags.length!==0">文章标签：</span>-->
        <li style="text-decoration: none;display: inline;margin-left: 20px;" v-for="tag in $store.state.article.tags" :key="tag">
         <a href="">{{tag}}</a>
        </li>
       </div>



    </div>
</template>

<script>

export default {
   name:"DetailHeader",
}
</script>

<style>
h1{
    border-bottom: none;
}

.header{
   width: 100%;
   height: 113px;
   /* background-color: rgb(29, 34, 125); */
   border-bottom: 1px solid #9fb2bf ;
}
.article-bar-top{
    width: 550px;
    height: 30px;
    /* background-color: red; */
    margin-top: 0px;
    display: flex;
    justify-content: space-around;
    opacity: 0.6;
}

</style>